<template>
	<view class="uni-container">
		<uni-forms ref="form" :model="formData" validateTrigger="bind">
			<uni-forms-item name="address" label="收货地址">
				<view class="mt9">{{formData.address}}</view>
			</uni-forms-item>
			<uni-forms-item name="goods_arr" label="商品信息">
				<view class="hx" v-for="(item,index) in formData.goods_arr" :key="index">
					<view>
						<image class="gsimg" :src="item.goods_img"></image>
					</view>
					<view class="gsinfo">
						<view class="gsname">{{item.goods_name}}</view>
						<view style="margin-top: 8px;">
							<text class="gssuk" v-for="suk in item.goods_suk">{{suk}}</text>
						</view>
						<view class="gssunu">
							<view class="gssuk">
								<text class="gsnum">{{item.goods_price /100 + '元'}}</text>
							</view>
							<text class="gsnum">×{{item.goods_num}}</text>
						</view>
					</view>
				</view>
			</uni-forms-item>
			<uni-forms-item name="notes" label="订单备注">
				<view class="mt9">{{formData.notes == ''?'无备注':formData.notes}}</view>
			</uni-forms-item>
			<uni-forms-item name="origprice" label="原始金额">
				<view class="mt9">{{formData.origprice/100 + '元'}}</view>
			</uni-forms-item>
			<uni-forms-item name="preferential" label="使用优惠">
				<text class="mt9" style="margin-right: 8px;line-height: 35px;"
					v-for="youhui in formData.preferential">{{youhui}}</text>
			</uni-forms-item>
			<uni-forms-item name="total_fee" label="支付金额">
				<view class="mt9">{{formData.total_fee/100 + '元'}}</view>
			</uni-forms-item>
			<uni-forms-item name="shippingInfo" label="物流公司">
				<uni-easyinput placeholder="填写快递公司名,如：圆通速递" v-model="formData.loginame"></uni-easyinput>
				<text style="font-size: 11px;color: #ff0000;">仅支持：极兔速递、京东物流、圆通速递、中通快递、申通快递、韵达快递、百世快递、邮政快递、德邦快递</text>
			</uni-forms-item>
			<uni-forms-item name="shippingInfo" label="物流单号">
				<uni-easyinput placeholder="填写物流单号" v-model="formData.loginum"></uni-easyinput>
			</uni-forms-item>
			<view class="uni-button-group">
				<button type="primary" class="uni-button" style="width: 100px;" @click="submit">发货</button>
				<navigator open-type="navigateBack" style="margin-left: 15px;">
					<button class="uni-button" style="width: 100px;">返回</button>
				</navigator>
			</view>
		</uni-forms>
	</view>
</template>

<script>
	const db = uniCloud.database();
	const dbCollectionName = 'uni-pay-orders';
	export default {
		data() {
			let formData = {
				"loginum": '',
				"loginame": '',
			}
			return {
				formDataId: '',
				formData,
			}
		},
		onLoad(e) {
			if (e.id) {
				const id = e.id
				this.formDataId = id
				this.getDetail(id)
			}
		},
		methods: {
			submit() {
				let name = ['京东物流', '圆通速递', '中通快递', '申通快递', '韵达快递', '百世快递', '邮政快递', '德邦快递', '极兔速递']
				if (name.includes(this.formData.loginame)) {
					if (this.formData.loginum != null && this.formData.loginum.length > 0) {
						db.collection("uni-pay-orders").doc(this.formDataId).update({
							"status": 4,
							"shippingInfo": {
								loginum: this.formData.loginum,
								loginame: this.formData.loginame
							}
						}).then(() => {
							uni.showToast({
								title: '发货成功'
							})
							this.getOpenerEventChannel().emit('refreshData')
							setTimeout(() => uni.navigateBack(), 500)
						}).catch((err) => {
							uni.showModal({
								content: err.message || '请求服务失败',
								showCancel: false
							})
						})
					} else {
						uni.showToast({
							title: "物流单号未填写",
							icon: "none",
							duration: 1600
						})
					}
				} else {
					uni.showToast({
						title: "物流公司错误",
						icon: "none",
						duration: 1600
					})
				}
			},
			/**
			 * 获取表单数据
			 * @param {Object} id
			 */
			getDetail(id) {
				uni.showLoading({
					mask: true
				})
				db.collection(dbCollectionName).doc(id).get().then((res) => {
					const data = res.result.data[0]
					if (data) {
						this.formData = data
					}
				}).catch((err) => {
					uni.showModal({
						content: err.message || '请求服务失败',
						showCancel: false
					})
				}).finally(() => {
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style>
	.mt9 {
		margin-top: 9px;
	}

	.hx {
		display: flex;
		flex-direction: row;
	}

	.gsimg {
		width: 100px;
		height: 100px;
		border-radius: 10px;
		margin-right: 10px;
	}

	.gsinfo {}

	.gsname {
		word-break: break-all;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
	}

	.gssunu {
		display: flex;
		margin-top: 35px;
	}

	.gssuk {
		font-size: 13px;
		color: #919191;
		flex: 1;
		margin-right: 6px;
	}

	.gsnum {
		font-size: 16px;
		color: #ff007f;
	}
</style>